<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>小兔鲜儿-个人中心</title>
  <meta name="description" content="小兔鲜儿官网，致力于打造全球最大的食品、生鲜电商购物平台。" />
  <meta name="keywords" content="小兔鲜儿,食品,生鲜,服装,家电,电商,购物" />
  <!-- icon图标 -->
  <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
  <!-- 样式初始化 -->
  <link rel="stylesheet" href="./css/base.css">
  <!-- 公共样式 -->
  <link rel="stylesheet" href="./css/common.css">
  <!-- 字体图标 -->
  <link rel="stylesheet" href="./lib/iconfont/iconfont.css">
  <!-- 个人中心样式 -->
  <link rel="stylesheet" href="./css/center.css">
</head>

<body>
  <!-- 头部导航 -->
  <header>
    <!-- 快捷菜单 -->
    <div class="xtx-shortcut">
      <nav class="w">
        <ul class="top-nav fr">
          <li><a href="./login.html">请先登录</a></li>
          <li><a href="./register.html">免费注册</a></li>
          <li><a href="./order.html">我的订单</a></li>
          <li><a href="./center.html">会员中心</a></li>
          <li><a href="javascript:;">帮助中心</a></li>
          <li class="about"><a href="javascript:;">联系我</a></li>
          <!-- 新窗口打开 -->
          <li class="concern"><a href="javascript:;">关注我</a></li>
          <li><a target="_blank" href="http://mcongblog.com/">我的博客</a></li>
        </ul>

      </nav>
    </div>
    <!-- 主导航 -->
    <div class="xtx-main-nav w">
      <!-- logo -->
      <h1 class="xtx-logo fl">
        <a href="javascript:;">小兔鲜儿</a>
      </h1>
      <!-- 顶部导航 -->
      <nav class="fl">
        <ul class="main-nav-font">
          <li>
            <a href="./index.html">首页</a>
          </li>
          <li>
            <a href="javascript:;">生鲜</a>
          </li>
          <li>
            <a href="javascript:;">美食</a>
          </li>
          <li>
            <a href="javascript:;">餐厨</a>
          </li>
          <li>
            <a href="javascript:;">电器</a>
          </li>
          <li>
            <a href="javascript:;">居家</a>
          </li>
          <li>
            <a href="javascript:;">洗护</a>
          </li>
          <li>
            <a href="javascript:;">孕婴</a>
          </li>
          <li>
            <a href="javascript:;">服装</a>
          </li>
        </ul>
      </nav>
      <div class="main-search fl">
        <input type="text" placeholder="搜一搜" />
        <div class="car">
          <span>2</span>
        </div>
      </div>
    </div>
  </header>
  <!-- 主体部分 -->
  <section>
    <div class="center-wrapper w">
      <!-- 侧边栏 -->
      <aside class="aside">
        <!-- 用户信息 -->
        <div class="user-meat">
          <picture class="pic">
            <img src="./uploads/touxiang.jpg" alt="">
          </picture>
          <h4>A Lucky Boy</h4>
          <a href="javascript:;">
            <i></i>
            黄金会员
          </a>
        </div>
        <!-- 我的账户 -->
        <div class="user-manage">
          <h4>我的账户</h4>
          <div class="links">
            <a href="./center.html">个人中心</a>
            <a href="javascript:;">消息通知</a>
            <a href="javascript:;">个人信息</a>
            <a href="javascript:;">安全设置</a>
            <a href="javascript:;">地址管理</a>
            <a href="javascript:;">我的积分</a>
            <a href="javascript:;">我的足迹</a>
            <a href="javascript:;">邀请有礼</a>
            <a href="javascript:;">幸运抽奖</a>
          </div>
        </div>
        <!-- 交易管理 -->
        <div class="user-manage">
          <h4>交易管理</h4>
          <div class="links">
            <a href="javascript:;">我的订单</a>
            <a href="javascript:;">优惠券</a>
            <a href="javascript:;">礼品卡</a>
            <a href="javascript:;">评价晒单</a>
            <a href="javascript:;">售后服务</a>
          </div>
        </div>
        <!-- 我的收藏 -->
        <div class="user-manage">
          <h4>我的收藏</h4>
          <div class="links">
            <a href="javascript:;">收藏的商品</a>
            <a href="javascript:;">收藏的商品</a>
            <a href="javascript:;">收藏的商品</a>
          </div>
        </div>
        <!-- 帮助中心 -->
        <div class="user-manage">
          <h4>帮助中心</h4>
          <div class="links">
            <a href="javascript:;">帮助中心</a>
            <a href="javascript:;">在线客服</a>

          </div>
        </div>
      </aside>
      <main class="main">
        <!-- 概况模块 -->
        <div class="overview">
          <div class="item">
            <a href="javascript:;">
              <img src="./images/vip.png" alt="" class="vip">
              <p>会员中心</p>
            </a>
            <a href="javascript:;">
              <img src="./images/safe.png" alt="" class="vip">
              <p>安全设置</p>
            </a>
            <a href="javascript:;">
              <img src="./images/address.png" alt="" class="address">
              <p>地址管理</p>
            </a>
          </div>
          <div class="item">
            <a href="javascript:;">
              <span>6</span>
              <p>优惠券</p>
            </a>
            <a href="javascript:;">
              <span>70</span>
              <p>礼品卡</p>
            </a>
            <a href="javascript:;">
              <span>120</span>
              <p>积分</p>
            </a>
          </div>
        </div>
        <!-- 我的订单 -->
        <div class="pannel-orders pannel">
          <div class="pannel-header">
            <h4>我的订单</h4>
            <a href="javascript:;">查看全部<i class="iconfont icon-arrow-right"></i></a>
          </div>
          <div class="orders">
            <ul>
              <li>
                <div class="goods">
                  <div class="pic">
                    <img src="./uploads/order_goods_1.jpg" alt="">
                  </div>
                  <div class="text">
                    <p>拉夫劳伦t恤男正品圆领短袖...</p>
                    <span>
                      颜色：白色 尺码：M 数量：1
                    </span>
                  </div>
                </div>
                <div class="status all">
                  <p>待付款</p>
                </div>
                <div class="pay all">
                  <span>￥99.00</span>
                  <p>（含运费：¥10.00元）</p>
                  <p>在线支付</p>
                </div>
                <div class="action all">
                  <a href="javascript:;" class="pay">立即付款</a>
                  <a href="javascript:;">查看详情</a>
                  <a href="javascript:;">取消订单</a>
                </div>
              </li>
              <li>
                <div class="goods">
                  <div class="pic">
                    <img src="./uploads/order_goods_2.jpg" alt="">
                  </div>
                  <div class="text">
                    <p>李宁跑步鞋男鞋空气弧...</p>
                    <span>
                      颜色：灰色 尺码：42 数量：1
                    </span>
                  </div>
                </div>
                <div class="status all">
                  <p>待收货</p>
                  <a href="javascript:;">
                    <p class="select">查看物流</p>
                  </a>
                </div>
                <div class="pay all">
                  <span>￥199.00</span>
                  <p>（含运费：¥10.00元）</p>
                  <p>在线支付</p>
                </div>
                <div class="action all">
                  <a href="javascript:;" class="pay">确认收货</a>
                  <a href="javascript:;">查看详情</a>
                  <a href="javascript:;">再次购买</a>
                </div>
              </li>
            </ul>
          </div>
        </div>
        <!-- 收藏的商品 -->
        <div class="panel-collect pannel">
          <!-- 收藏的商品 -->
          <div class="pannel-header">
            <h4>收藏的商品</h4>
            <a href="javascript:;">查看全部<i class="iconfont icon-arrow-right"></i></a>
          </div>
          <div class="item">
            <a href="javascript:;">
              <div class="pic">
                <img src="./uploads/clothes_goods_1.jpg" alt="">
              </div>
              <p>人本秋季厚底帆布鞋</p>
              <p>韩版低帮增高学生</p>
              <span>￥<i>55</i> </span>
            </a>
            <a href="javascript:;">
              <div class="pic">
                <img src="./uploads/clothes_goods_2.jpg" alt="">
              </div>
              <p>迪士尼真皮针扣表带宽度</p>
              <p>14-16mm规格双色压纹</p>
              <span>￥<i>20.9</i> </span>
              <span class="discount">6折</span>
            </a>
            <a href="javascript:;">
              <div class="pic">
                <img src="./uploads/clothes_goods_3.jpg" alt="">
              </div>
              <p>三都港 冷冻无公害黄花鱼</p>
              <p>700g 2条 袋装</p>
              <span>￥<i>209</i> </span>
            </a>
            <a href="javascript:;">
              <div class="pic">
                <img src="./uploads/clothes_goods_4.jpg" alt="">
              </div>
              <p>ONLY夏季新款高腰宽松</p>
              <p>七分阔腿裙裤休闲裤</p>
              <span>￥<i>274.5</i> </span>
            </a>

          </div>

        </div>
        <!-- 我的足迹 -->
        <div class="panel-commodity pannel">
          <div class="pannel-header">
            <h4>我的足迹</h4>
            <a href="javascript:;">查看全部<i class="iconfont icon-arrow-right"></i></a>
          </div>
          <div class="item">
            <a href="javascript:;">
              <div class="pic">
                <img src="./uploads/clothes_goods_5.jpg" alt="">
              </div>
              <p>拉夫劳伦t恤男正品</p>
              <p>圆领短袖</p>
              <span>￥<i>99</i> </span>
            </a>
            <a href="javascript:;">
              <div class="pic">
                <img src="./uploads/clothes_goods_6.jpg" alt="">
              </div>
              <p>李宁跑步鞋男鞋空气弧</p>
              <p>2018春季新款</p>
              <span>￥<i>171.9</i> </span>
              <span class="discount">6折</span>
            </a>
            <a href="javascript:;">
              <div class="pic">
                <img src="./uploads/clothes_goods_7.jpg" alt="">
              </div>
              <p>回力老年健身鞋</p>
              <p>2018春季新款</p>
              <span>￥<i>209</i> </span>
            </a>
            <a href="javascript:;">
              <div class="pic">
                <img src="./uploads/clothes_goods_8.jpg" alt="">
              </div>
              <p>ONLY夏季新款背心</p>
              <p>2018夏季新款</p>
              <span>￥<i>274.5</i> </span>
            </a>
          </div>
        </div>

      </main>
    </div>
  </section>
  <!-- 底部 -->
  <footer>
    <div class="xtx-footer w">
      <!-- 客户服务 -->
      <div class="footer-server fl">
        <p>客户服务</p>
        <div class="service">在线客服</div>
        <div class="question">问题反馈</div>
      </div>
      <!-- 关注我们 -->
      <div class="footer-we fl">
        <p>关注我们</p>
        <div class="number">公众号</div>
        <div class="weibo">微博</div>
      </div>
      <!-- 下载APP -->
      <div class="footer-download fl">
        <p>下载APP</p>
        <div class="code">
          <img src="./uploads/qrcode.png" alt="">
        </div>
        <div class="download">
          <p>扫秒二维码</p>
          <br />
          <p>立即下载APP</p>
          <a href="javascript:;">立即下载</a>
        </div>
      </div>
      <!-- 服务热线 -->
      <div class="footer-hotline fr">
        <p>服务热线</p>
        <div class="num">400-0000-000</div>
        <span>周一至周日 8:00-18:00</span>
      </div>
    </div>

    <div class="xtx-bottom">
      <div class="w">
        <div class="bottom-service">
          <div class="bottom-box">
            <a href="javascript:;">价格亲民</a>
            <a href="javascript:;">物流快捷</a>
            <a href="javascript:;">品质新鲜</a>
          </div>
        </div>
        <div class="bottom-copyright">
          <ul>
            <li><a href="javascript:;">关于我们</a></li>
            <li><a href="javascript:;">帮助中心</a></li>
            <li><a href="javascript:;">售后服务</a></li>
            <li><a href="javascript:;">配送与验收</a></li>
            <li><a href="javascript:;">商务合作</a></li>
            <li><a href="javascript:;">搜索推荐</a></li>
            <li><a target="_blank" href="http://mcongblog.com/">友情链接</a></li>
          </ul>
          <p>CopyRight © A Lucky Boy 版权所有</div>
      </div>
    </div>
  </footer>
  <!-- 用户登录模块 -->
  <script src="./js/common.js"></script>
</body>

</html>